/*
 * @Author: xiaosihan 
 * @Date: 2024-06-20 18:31:01 
 * @Last Modified by: xiaosihan
 * @Last Modified time: 2024-09-19 09:25:15
 */

import loginStore from "@views/pc/LoginModal/loginStore";
import userStore from "@views/userStore";
import { Dropdown } from "antd";
import clsx from "clsx";
import { autorun } from "mobx";
import { ReactNode, useEffect, useState } from "react";
import styles from "./loginBtn.module.less";
import hashHistory from "@hashHistory";

interface Iprops {
    children?: ReactNode,
    isHome?: boolean
}

// 登录按钮
export default function LoginBtn(props: Iprops) {

    const [isLogin, setIsLogin] = useState(userStore.isLogin);
    const [name, setName] = useState(userStore.name);
    const [phone, setPhone] = useState(userStore.phone);

    useEffect(() => {

    }, []);

    useEffect(() => autorun(() => {
        setIsLogin(userStore.isLogin);
        setName(userStore.name);
        setPhone(userStore.phone);
    }), []);

    //登录
    const login = () => {
        loginStore.setShowLoginModal(true);
    }

    return (
        <div className={styles.loginBtn} >
            {
                isLogin ?
                    <>
                        {
                            props.isHome ?
                                <span
                                    className={styles.to_home}
                                    onClick={() => hashHistory.push("/userCenter")}
                                >进入主页</span>
                                :
                                <span className={styles.message}  >消息</span>
                        }

                        <Dropdown
                            placement="bottom"
                            mouseEnterDelay={0}
                            menu={{
                                items: [
                                    {
                                        key: '1',
                                        label: (
                                            <div
                                                onClick={() => {
                                                    hashHistory.push("/partsLibrary")
                                                }}
                                                className={clsx(styles.dropdownItem, styles.linght50)}
                                            >
                                                <div
                                                    className={clsx(styles.font14, styles.fontBold)}

                                                >所有文件</div>
                                            </div>
                                        ),
                                    },
                                    {
                                        key: '2',
                                        label: (
                                            <div
                                                onClick={() => {
                                                    hashHistory.push("/userCenter")
                                                }}
                                                className={styles.dropdownItem}
                                            >
                                                <div
                                                    className={clsx(styles.font14, styles.fontBold)}

                                                > 个人主页</div>
                                                <div className={styles.subLable} >
                                                    待办事项/快捷处理
                                                </div>
                                            </div>
                                        ),
                                    },
                                    {
                                        key: '3',
                                        label: (
                                            <div
                                                onClick={() => {
                                                    hashHistory.push("/accountSettings")
                                                }}
                                                className={styles.dropdownItem}
                                            >
                                                <div
                                                    className={clsx(styles.font14, styles.fontBold)}

                                                >账号设置</div>
                                                <div className={styles.subLable} >
                                                    账号信息/用户信息
                                                </div>
                                            </div>
                                        ),
                                    },
                                    {
                                        key: '4',
                                        label: (
                                            <div
                                                onClick={() => {
                                                    // hashHistory.push("/partsLibrary")
                                                }}
                                                className={styles.dropdownItem}
                                            >
                                                <div
                                                    className={clsx(styles.font14, styles.fontBold)}

                                                >应用中心</div>
                                                <div className={styles.subLable} >
                                                    API/第三方平台
                                                </div>
                                            </div>
                                        ),
                                    },
                                    {
                                        key: '5',
                                        label: (
                                            <div
                                                onClick={() => userStore.loginOut()}
                                                className={clsx(styles.dropdownItem, styles.none_border, styles.linght50)}
                                            >
                                                <div
                                                    className={clsx(styles.font14, styles.fontBold)}

                                                >退出登录</div>
                                            </div>
                                        ),
                                    },
                                ]
                            }}>
                            <span className={styles.name} >{(name || "-").slice(0, 2)}</span>
                        </Dropdown>
                    </>
                    :
                    <>
                        <span className={styles.login} onClick={login} >登录</span>
                        <span
                            className={styles.getPrice}
                            onClick={login}
                        // onClick={() => hashHistory.push("/updataModel")}
                        >获取报价</span>
                    </>
            }
        </div>
    );

}